<template>
  <div class="container" @click="clickHandle('test click', $event)">
    <searchs :inputShowed="inputShowed" :inputVal="inputVal" :showInput="showInput"></searchs>
    <swiper :imgUrls="imgUrls"></swiper>
    <grid :grids="grids" :goDetail="goDetail"></grid>
  </div>
</template>

<script>
import card from '@/components/card'
import swiper from '@/components/swiper'
import grid from '@/components/grid'
import searchs from '@/components/search'
export default {
  data () {
    return {
      motto: 'Hello World',
      userInfo: {},
      imgUrls: [
        'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',
        'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg',
        'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg'
      ],
      inputShowed: false,
      inputVal: '',
      grids: [
        { src: '/static/images/icon_nav_button.png', name: 'Button' },
        { src: '/static/images/icon_nav_cell.png', name: 'Cell' },
        { src: '/static/images/icon_nav_toast.png', name: 'Toast' },
        { src: '/static/images/icon_nav_dialog.png', name: 'Dialog' },
        { src: '/static/images/icon_nav_button.png', name: 'Progress' },
        { src: '/static/images/icon_nav_panel.png', name: 'Msg' },
        { src: '/static/images/icon_nav_article.png', name: 'Article' },
        { src: '/static/images/icon_nav_actionSheet.png', name: 'ActionSheet' },
        { src: '/static/images/icon_nav_icons.png', name: 'Icons' }
      ]
    }
  },
  mounted () {
    wx.setTabBarItem({
      index: 0,
      text: 'text'
      // iconPath: '/path/to/iconPath',
      // selectedIconPath: '/path/to/selectedIconPath'
    },
    {
      index: 1,
      text: 'text1'
      // iconPath: '/path/to/iconPath',
      // selectedIconPath: '/path/to/selectedIconPath'
    }
    )
  },
  components: {
    card,
    swiper,
    grid,
    searchs
  },

  methods: {
    goDetail () {
      wx.navigateTo({
        url: '../../pages/main/main'
      })
    },
    showInput () {
      wx.navigateTo({
        url: '../../pages/counter/main'
      })
      console.log('showInput')
    //   this.inputShowed = false
    },
    bindViewTap () {
      const url = '../logs/main'
      wx.navigateTo({ url })
    },
    getUserInfo () {
      // 调用登录接口
      wx.login({
        success: () => {
          wx.getUserInfo({
            success: (res) => {
              this.userInfo = res.userInfo
            }
          })
        }
      })
    },
    clickHandle (msg, ev) {
      console.log('clickHandle:', msg, ev)
    }
  },

  created () {
    // 调用应用实例的方法获取全局数据
    this.getUserInfo()
  }
}
</script>

<style scoped>
.userinfo {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.userinfo-avatar {
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx;
  border-radius: 50%;
}

.userinfo-nickname {
  color: #aaa;
}

.usermotto {
  margin-top: 150px;
}

.form-control {
  display: block;
  padding: 0 12px;
  margin-bottom: 5px;
  border: 1px solid #ccc;
}

.counter {
  display: inline-block;
  margin: 10px auto;
  padding: 5px 10px;
  color: blue;
  border: 1px solid blue;
}
</style>
